﻿<html>
<head>
	<title>Lesson3 文本處理</title>
	<LINK href="punc.css" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="catchquestion.js"></script>
	<script type="text/javascript" src="google-spreadsheet.js"></script>
	<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
	
	<button  onclick="comparepunc()"  style="font-size:200%">確認答案</button><span id=report style="font-size:150%"></span>
	<button onclick="submitanwser()" style="font-size:200%">送出</button>
	<span style="color:blue">開始作答時請先按開始，作答完畢後按停止，再按確認答案，確認答案後按送出，如欲更改答案，請再按開始，繼續作答。滑鼠在文字上點一下，逗號。按住Ctrl是句號，按住Alt 是頓號。如果有任何標點，再點一下取消。
	</span>
	
<script>
var textsource="";
var key = "0Ai_eMDIZnHmYdEJiSFczYWVaMXM2V0tpVUxYU1FHOWc&output=html";
loadquiz(key, function(res) {
	     //$('#results').html(JSON.stringify(res).replace(/,/g,",\n"));
		 
		 //
		 showquiz(res);
		 
	  });
var showquiz=function(resultarray){

			for(var i in resultarray){
				var r=resultarray[i];
				
				}
				console.log('r.question',r.question);
				textsource=r.question;
				console.log('textsource',textsource);
			
}

var user=[];
var teacherpunc=[];
var chcount=0;
var secupload=0;
var submitanwser=function() {


  tendtm();
  secupload=parseInt(ths)*3600+parseInt(tms)*60+parseInt(tss);
  window.location.href='https://docs.google.com/spreadsheet/viewform?formkey=dENpbVhSZE5FV25QR25SaF9FLU9wVGc6MQ&entry_1='+JSON.stringify(user)+"&entry_2="+secupload; 
}
var onchclick=function(e){
  var ch=e.target;
  var evtobj=window.event? event : e ;
  var flag=0;
  tstarttm();
  if (this.className!="punc_none")  this.className="punc_none"; 
  else {
      flag=0;
       var ty="";
       if (evtobj.altKey ) flag=1;
       if (evtobj.ctrlKey ) flag=flag + 2;
       
       if (1==flag) { this.className="punc_break"; ty="、"; }
       else if (2==flag )  {this.className="punc_fullstop"; ty="。"; }
       else if (0==flag) {this.className="punc_comma";ty="，"; }
       var pos=parseInt(ch.id.substr(2));
       user[pos]=ty;
	}
	
}
function report(misscount,diffcount)
{
	finmis=(misscount+diffcount)/112*100;
	fincor=corr/19*100;
    //document.getElementById('report').innerHTML ='總標數'+d+'/漏標'+misscount+'／誤標'+diffcount +'／正確'+corr+'／正確率'+fincor.toFixed(2)+'％' ;
}

var diffcount=0;
var misscount=0;
var wrongcount=0;
var corr=0;
var finmis=0;
var fincor=0;
var comparepunc=function() {
    misscount=0;
    diffcount=0;
	wrongcount=0;
	 corr=0;
	for(i=0;i<=chcount;i++){
		var T=teacherpunc[i],S=user[i];
		if (T && !S) {
			misscount++;
		   }
           else if (S && !T) {
			diffcount++;
		   }
		    else if (!S && !T) {
			wrongcount++;
		   }
		   else if (S && T) {
			corr++;
		   }	   
        }
		
		
		console.log('user',user);
		console.log('teacherpunc',teacherpunc);
		console.log('diffcount',diffcount);
		console.log('misscount',misscount);
		console.log('corr',corr);
		console.log('mis',finmis+'%');
		console.log('fincor',fincor+'%');
		report(misscount,diffcount,wrongcount,corr);
	
	}



var removepunc=function(textinput) {
	var result="";
	var puncs="。，!、；";
	for(var i in textinput){
		var code=textinput.charCodeAt(i);
		if(puncs.indexOf(textinput.charAt(i))==-1){
			result+=textinput.charAt(i);
		}
	}
	return  result;
}
var d=0;
var getpuncpos=function(textinput){
	var puncpos=[];
	
	var puncs="。，!、；";
	for(var i in textinput){
		
		i=parseInt(i);
		var code=textinput.charCodeAt(i);
		if(puncs.indexOf(textinput.charAt(i))>-1){
			d++;
			puncpos[i-d]=textinput.charAt(i);
			console.log(d);
		}
	}
	d-=1;
	console.log('teacher',puncpos);
	return puncpos;
}



var createspan=function(data){
	for(var i in data){
	 	var ch=document.createElement("span");
		ch.innerHTML=data[i]+' ';
		ch.onclick=onchclick;
		
		ch.id="ch"+chcount;
		ch.className="punc_none";
		chcount++;
		text1.appendChild(ch);
	//document.getElementById("tex1").innerHTML=data;
	}
	}

var init=function() {
  createspan( removepunc(textsource) );
 
  teacherpunc=getpuncpos(textsource);
}
var ttmnow=0;
var ths='0';
var thn=0;
var tms='0';
var tmn=0;
var tss='0';
var tsn=0;

function treset()
  {
  tendtm();
  thn=0;
  tmn=0;
  tsn=0;
  document.ttmfm.ttm.value = '00:00:00';
  }

function tendtm()  {
  if (ttmnow)
    clearTimeout(ttmnow);
  }

function tstarttm()  {
    {

  ths=thn;
  tms=tmn;
  tss=tsn;
 if (thn<10)
    ths='0' + ths;
  if (tmn<10)
    tms='0'+tms;
  if (tsn<10)
    tss='0'+tss;
  document.ttmfm.ttm.value = '' + ths+':'+tms+':'+tss;
   if (ttmnow)
{
clearTimeout(ttmnow);
ttmnow=0;
}
    tsn+=1;
    if (tsn>59)
  {
  tmn+=1;
  tsn=0;
  if (tmn>59)
    {
    thn+=1;
    tmn=0;
    if (thn>23)
  thn=0;
    }
  }
    }
   ttmnow=setTimeout("tstarttm()",1000);
  }

</script>

<form name="ttmfm">
<input type="text" name="ttm" size=8>
<br> <input type="button" name="開始" value="開始" onClick="tstarttm()">
<input type="button" name="停止" value="停止" onClick="tendtm()">


</script>
</head>

<body onload="init()" background="paper.png">
<div id="text1"></div>


</body>
</html>